@import url('_funs.less');

.content {
  width: 1200px;
  display: block;
  margin: 0 auto;
}

.basecolor {
  color: @basecolor;
}

body {
  font-size: 14px;
  min-width: 1200px;
  background: #fff;
  font-family: 'Microsoft YaHei', Helvetica, Arial, sans-serif;
  color: #333;
  overflow-x: hidden;
}

input,
textarea {
  outline: none;

  &::-webkit-input-placeholder {
    color: #999;
  }

  &::-moz-placeholder {
    color: #999;
  }

  &:-ms-input-placeholder {
    color: #999;
  }
}

a:active,
a:visited,
a:link {
  text-decoration: none;
}

.dot {
  position: relative;
  padding-left: 20px;

  &::before {
    content: '';
    width: 4px;
    height: 4px;
    position: absolute;
    left: 8px;
    top: 50%;
    margin-top: -2px;
    background: #666;
    transform: rotate(45deg)
  }
}

ul {
  margin: 0;
  padding: 0;

  li {
    list-style: none;
  }
}

.cf {
  .-clearfix();
}

.head {
  background: #000;

  .content {
    .-text-height(50px);
    overflow: hidden;

    .pull-left {
      color: #fff;
      font-size: 15px;

      i {
        font-size: 18px;
      }

      a {
        color: @basecolor;

        &:hover {
          color: @basecolor-dark;
        }
      }
    }

    .pull-right {
      a {
        display: inline-block;
        color: #fff;
        padding: 0 20px;

        &:hover {
          color: @basecolor;
        }
      }
    }
  }
}

.nav {
  .content {
    height: 90px;

    .pull-left {
      height: 100%;

      .logo {
        display: block;
        height: 70px;
        margin-top: 10px;
      }

      .list {
        margin-left: 140px;
        overflow: hidden;

        a {
          float: left;
          position: relative;
          font-size: 15px;
          color: #333;
          line-height: 90px;
          padding: 0 22px;

          &:hover,
          &.active {
            color: @basecolor;
            text-decoration: none;

            &:before {
              content: '';
              position: absolute;
              bottom: 20px;
              height: 3px;
              border-radius: 3px;
              left: 50%;
              width: 50px;
              margin-left: -25px;
              background: @basecolor;
            }
          }
        }
      }
    }

    .pull-right {
      .search {
        width: 190px;
        overflow: hidden;
        .-text-height(35px);
        border: 1px solid @line-color;
        border-radius: 35px;
        margin-top: 27px;
        font-weight: normal;

        input {
          border: none;
          width: 155px;
          float: left;
          height: 100%;
          padding: 0 10px;
        }

        i {
          cursor: pointer;
          font-size: 22px;
          float: right;
          padding-right: 10px;
        }
      }
    }
  }
}

.banner {
  display: block;
  min-width: 100px;
  width: 100%;
}

.footer {
  background: #333;

  .content {
    padding: 25px 0 10px;
    color: #999;

    .list {
      overflow: hidden;
      margin-bottom: 20px;

      span {
        float: left;
        cursor: pointer;
        font-size: 13px;
        background: #000;
        padding: 5px 10px;
        margin-right: 10px;

        &:hover,
        &.active {
          background: #999;
          color: #fff;
        }
      }
    }

    .alist {
      overflow: hidden;

      a {
        font-size: 10px;
        float: left;
        color: #999;
        margin: 0 10px 10px 0;

        &:hover {
          color: #fff;
        }
      }
    }
  }
}

.li4 {
  background: @basecolor;
  padding: 55px 0;
  color: #fff;

  .content {
    overflow: hidden;
    padding: 0 40px;

    .pull-left {
      font-size: 40px;
      font-weight: bold;
      margin-top: 20px;
    }

    .m {
      float: left;
      margin: 30px 0 10px 60px;

      img {
        height: 15px;
        float: left;
        margin-top: 5px;
        margin-right: 3px;
      }

      .text {
        float: left;

        &>div:first-child {
          font-size: 16px;
        }
      }
    }

    .pull-right {
      float: right;

      li {
        float: left;
        margin-left: 35px;
        line-height: 30px;
        text-align: center;

        .img {
          border: 1px solid #fff;
          height: 120px;
          width: 120px;

          img {
            display: block;
            width: 100%;
            height: 100%;
          }
        }
      }
    }
  }
}

.banners {
  overflow: hidden;
  display: inline-block;
  width: 100%;
  position: relative;

  &:after {
    content: '';
    display: block;
    margin-top: 26.17%;
  }

  &>div {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
  }
}

.pagination2,
.pagination3 {
  position: absolute;
  left: 0;
  right: 10px;
  bottom: 15px;
  text-align: right;
  margin: 0;
  z-index: 100;
}

.swiper-pagination-switch {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background: #555;
  margin: 0 5px;
  opacity: 0.8;
  border: 1px solid #fff;
  cursor: pointer;
}

.swiper-active-switch {
  background: #fff;
}

.fixright {
  position: fixed;
  display: none;
  left: 50%;
  margin-left: 620px;
  bottom: 100px;
  overflow: hidden;
  width: 70px;
  border: 1px solid @line-color;
  z-index: 100;

  img {
    .-imgblock();
    height: 70px;
  }

  a {
    .-text-height(70px);
    display: block;
    text-align: center;
    color: #666;
    border-top: 1px solid @line-color;
    font-size: 30px;
    background: #fff;

    &:hover {
      text-decoration: none;
      color: #333;
    }
  }
}

h1,
h2,
h3,
h4,
h5,
p,
a {
  color: #333;
  font-family: 'Microsoft YaHei', Helvetica, Arial, sans-serif;
}

.aboutUs {
  font-size: 12px;
  text-align: center;

  .t {
    color: #fff;

    a,
    span {
      display: inline-block;
      color: #fff;
      margin: 0 10px;
    }
  }

  .b {
    margin-top: 10px;
    display: inline-block;
    text-align: left;
  }
}